'use strict';

window.addEventListener('load', function () {
  $('#loader').fadeOut('1500');
})

$("#navigation").navigation({
  mobileBreakpoint: 1030,
  submenuIndicator: false,
  effect: "fade"
});

$("#contact-menu").navigation({
  hidden: true //the navigation bar is hidden
});


$('.btn-show').on('click', function (e) {
  $("#contact-menu").data("navigation").toggleOffcanvas();
});


var fullscreenOwl = $("#fullscreen-slider");
// 选择具有 id="fullscreen-slider" 的元素，并将其存储在变量 fullscreenOwl 中

fullscreenOwl.owlCarousel({
  // 对选定的元素进行初始化，将其转换为 Owl Carousel 轮播图
  loop: true, // 轮播图会循环播放
  margin: 0, // 轮播项之间没有间距
  items: 1, // 每次显示一个轮播项
  autoplay: true, // 自动播放轮播项
  autoplayTimeout: 7000, // 轮播间隔为 7000 毫秒（即7秒）
  nav: true, // 显示导航箭头
  dots: false, // 不显示分页点
  navSpeed: 500, // 导航箭头的过渡动画速度为 500 毫秒
  singleItem: true, // 每次仅显示一个轮播项
  onInitialized: firstSlide, // 轮播图初始化完成时调用 firstSlide 函数
  navText: [
    // 导航箭头的 HTML 内容，分别是向前和向后的箭头
    "<svg t='1715567203966' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='8046' width='50' height='50'><path d='M542.165333 225.834667a42.666667 42.666667 0 0 0-60.330666 0l-256 256-2.496 2.709333a42.666667 42.666667 0 0 0 2.496 57.621333l256 256 2.709333 2.496a42.666667 42.666667 0 0 0 57.621333-2.496l2.496-2.709333a42.666667 42.666667 0 0 0-2.496-57.621333L316.373333 512l225.813334-225.834667 2.496-2.709333a42.666667 42.666667 0 0 0-2.496-57.621333z m256 0a42.666667 42.666667 0 0 0-60.330666 0l-256 256-2.496-2.709333a42.666667 42.666667 0 0 0 2.496-57.621333l256-256 2.709333-2.496a42.666667 42.666667 0 0 0 57.621333 2.496l2.496 2.709333a42.666667 42.666667 0 0 0-2.496 57.621333L572.373333 512l225.813334-225.834667 2.496-2.709333a42.666667 42.666667 0 0 0-2.496-57.621333z' fill='#5F6A7A' p-id='8047'></path></svg>",
    "<svg t='1715567216544' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='8189' width='50' height='50'><path d='M481.834667 225.834667a42.666667 42.666667 0 0 1 60.330666 0l256 256 2.496 2.709333a42.666667 42.666667 0 0 1-2.496 57.621333l-256 256-2.709333 2.496a42.666667 42.666667 0 0 1-57.621333-2.496l-2.496-2.709333a42.666667 42.666667 0 0 1 2.496-57.621333L707.626667 512 481.834667 286.165333l-2.496-2.709333a42.666667 42.666667 0 0 1 2.496-57.621333z m-256 0a42.666667 42.666667 0 0 1 60.330666 0l256 256 2.496 2.709333a42.666667 42.666667 0 0 1-2.496 57.621333l-256 256-2.709333 2.496a42.666667 42.666667 0 0 1-57.621333-2.496l-2.496-2.709333a42.666667 42.666667 0 0 1 2.496-57.621333L451.626667 512 225.834667 286.165333l-2.496-2.709333a42.666667 42.666667 0 0 1 2.496-57.621333z' fill='#5F6A7A' p-id='8190'></path></svg>"
  ],
  animateIn: 'pulse'
});


function firstSlide(event) {
  var item = event.item.index;
  if (item == 2) {
    var $currentItem = $('.owl-item', fullscreenOwl).eq(event.item.index);
    var $elemsToanim = $currentItem.find("[data-animation]");
    setAnimation($elemsToanim);
  }
}

fullscreenOwl.on('changed.owl.carousel', function (event) {
  var $currentItem = $('.owl-item', fullscreenOwl).eq(event.item.index);
  var $elemsToanim = $currentItem.find("[data-animation]");

  setAnimation($elemsToanim);
})

function setAnimation(_elem) {
  var animationEndEvent = 'webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend';

  _elem.each(function () {
    var $elem = $(this);
    $elem.removeClass('animated');
    $elem.removeClass($elem.data('animation'));

    var $animationType = 'animated ' + $elem.data('animation');
    var $animationTimeOut = $elem.data('timeout');

    if ($animationTimeOut) {
      window.setTimeout(function () {
        $elem.addClass($animationType);
      }, parseInt($animationTimeOut, 10));
    } else {

      $elem.addClass($animationType);
    }
  });
}


var owl4 = $("#coming-soon-carousel");
owl4.owlCarousel({
  loop: true,
  margin: 0,
  items: 1,
  autoplay: true,
  autoplayTimeout: 6000,
  nav: false,
  dots: false,
  navSpeed: 1400,
  singleItem: true
});



$('.toggle').on('click', function (e) {
  e.preventDefault();

  var $this = $(this);
  if ($this.next().hasClass('show')) {
    $('.toggle').removeClass('current');
    $(this).toggleClass('current');
    $this.next().removeClass('show');
    $this.next().slideUp(350);
  } else {
    $('.toggle').removeClass('current');
    $(this).toggleClass('current');
    $this.parent().parent().find('li .inner').removeClass('show');
    $this.parent().parent().find('li .inner').slideUp(350);
    $this.next().toggleClass('show');
    $this.next().slideToggle(350);
  }
});
window.addEventListener('load', function () {

  var $window = $(window),
    win_height_padded = $window.height() * 1.1,
    isTouch = Modernizr.touch;

  if (isTouch) { $('.animate').addClass('animated'); }

  $window.on('scroll', animateScroll);

  function animateScroll() {
    var scrolled = $window.scrollTop(),
      win_height_padded = $window.height() * 1.1;

    $(".animate:not(.animated)").each(function () {
      var $this = $(this),
        offsetTop = $this.offset().top;

      if (scrolled + win_height_padded > offsetTop) {
        if ($this.data('timeout')) {
          window.setTimeout(function () {
            $this.addClass('animated ' + $this.data('animation'));
          }, parseInt($this.data('timeout'), 10));
        } else {
          $this.addClass('animated ' + $this.data('animation'));
        }
      }
    });

  }

  animateScroll();
});



// 7. DATEPICKER
//================================================================

$('#date1').datetimepicker({
  format: 'YYYY-DD-MM',
  icons: {
    time: "icon-clock icons",
    next: "icon-arrow-right icons",
    previous: "icon-arrow-left icons"
  }
});
$('#date2').datetimepicker({
  format: 'YYYY-DD-MM',
  icons: {
    time: "icon-clock icons",
    next: "icon-arrow-right icons",
    previous: "icon-arrow-left icons"
  }
});
$('#date3').datetimepicker({
  format: 'YYYY-DD-MM',
  icons: {
    time: "icon-clock icons",
    next: "icon-arrow-right icons",
    previous: "icon-arrow-left icons"
  }
});
$('#date4').datetimepicker({
  format: 'YYYY-DD-MM',
  icons: {
    time: "icon-clock icons",
    next: "icon-arrow-right icons",
    previous: "icon-arrow-left icons"
  }
});



// 8. COUNTER
//================================================================

var a = 0;
$(window).scroll(function () {

  if ($("#counter").length > 0) {
    var oTop = $('#counter').offset().top - window.innerHeight;
    if (a == 0 && $(window).scrollTop() > oTop) {
      $('.counter-value').each(function () {
        var $this = $(this),
          countTo = $this.attr('data-count');
        $({
          countNum: $this.text()
        }).animate({
          countNum: countTo
        },
          {
            duration: 2000,
            easing: 'swing',
            step: function () {
              $this.text(Math.floor(this.countNum));
            },
            complete: function () {
              $this.text(this.countNum);
            }
          });
      });
      a = 1;
    }
  }

});

// 给 id 为 "date-depart-input" 的滑块绑定 "slide" 事件监听器
$("#date-depart-input").slider();
$("#date-depart-input").on("slide", function (slideEvt) {
  if (slideEvt.value[0] == 1) {
    $("#date-depart-1").text(slideEvt.value[0] + ' day');
  } else {
    $("#date-depart-1").text(slideEvt.value[0] + ' days');
  }

  if (slideEvt.value[1] == 1) {
    $("#date-depart-2").text(slideEvt.value[1] + ' day');
  } else {
    $("#date-depart-2").text(slideEvt.value[1] + ' days');
  }
});

// 初始化 id 为 "budget-input" 的滑块
$("#budget-input").slider();

// 给 id 为 "budget-input" 的滑块绑定 "slide" 事件监听器
$("#budget-input").on("slide", function (slideEvt) {
  $("#budget-1").text('$ ' + slideEvt.value[0]);
  $("#budget-2").text('$ ' + slideEvt.value[1]);
});

$(window).scroll(function () {
  if ($(this).scrollTop() > 1300) {
    $('.scrollup').slideDown(300);
  } else {
    $('.scrollup').slideUp(300);
  }
});

$(document).on('click', '.scrollup', function () {
  $("html, body").animate({
    scrollTop: 0
  }, 1200);
  return false;
});

function scrollToDiv(element, navheight) {
  var offset = element.offset();
  var offsetTop = offset.top;
  var totalScroll = offsetTop - navheight;
  $('body, html').animate({ scrollTop: totalScroll }, 1800);
}

$('li.to-section a').on('click', function (e) {
  e.preventDefault();
  var el = $(this).attr('href');
  var elWrapped = $(el);
  scrollToDiv(elWrapped, 0);

  $('li.to-section a').removeClass('active');
  $(this).addClass('active');

});


var hdr = $(window).height() - 1;

var hm = $("ul.section-to-block-menu");
$(window).scroll(function () {
  if ($(this).scrollTop() > hdr) {
    hm.addClass("nav-menu-sticky");
  } else {
    hm.removeClass("nav-menu-sticky");
  }
});


var didScroll;
var lastScrollTop = 0;
var delta = 5;
var navbarHeight = $('.main-header').outerHeight();

$(window).scroll(function (event) {
  didScroll = true;
});

setInterval(function () {
  if (didScroll) {
    hasScrolled();
    didScroll = false;
  }
}, 250);

function hasScrolled() {
  var st = $(this).scrollTop();

  if (Math.abs(lastScrollTop - st) <= delta)
    return;

  if (st > lastScrollTop && st > navbarHeight) {

    $(".main-header").removeClass("main-header-sticky");
    $("body").removeClass("header-bg-sticky");
  } else {

    if (st + $(window).height() < $(document).height()) {
      $(".main-header").addClass("main-header-sticky");
      $("body").addClass("header-bg-sticky");
    }
  }

  lastScrollTop = st;
}
